<template>
  <Theme>
    <div slot="main">
      <div>
      <el-input style="width:400px " v-model="queryParam.param1"></el-input>
      <el-button type="primary" @click="queryStore()">查询</el-button>          
    </div>
    <el-table :data="storeList" border style="width: 100%">
      <el-table-column prop="storeName" label="店名"> </el-table-column>
      <el-table-column prop="storeLicense" label="营业执照号码">
      </el-table-column>
      <el-table-column prop="storeAddress" label="营业地址"> </el-table-column>
      <el-table-column prop="storeBoss" label="法人"> </el-table-column>
      <el-table-column prop="storeState" label="审核状态"> </el-table-column>
      <el-table-column label="操作" width="320">
        <template slot-scope="scope">
          <el-popover placement="right" width="400" trigger="click">
            <el-form ref="store" :model="store" label-width="80px">
              <el-form-item label="门店名称">
                <el-input v-model="store.storeName"></el-input>
              </el-form-item>
              <el-form-item label="营业地址">
                <el-input v-model="store.storeAddress"></el-input>
              </el-form-item>
              <el-form-item label="定位">
                <el-input v-model="store.storeLocation"></el-input>
              </el-form-item>
              <el-form-item label="法人">
                <el-input v-model="store.storeBoss"></el-input>
              </el-form-item>
              <el-form-item label="联系电话">
                <el-input v-model="store.storeTel"></el-input>
              </el-form-item>
              <el-form-item label="特色">
                <el-input v-model="store.storeFeature"></el-input>
              </el-form-item>
              <el-form-item label="佣金比例">
                <el-input v-model="store.storeProportion"></el-input>
              </el-form-item>
              <el-form-item label="店铺照片">
                <img :src="store.storePic" alt="">
              </el-form-item>
            </el-form>
            <el-button
              slot="reference"
              size="mini"
              @click="handleCheck(scope.$index, scope.row)"
              >查看</el-button
            >
          </el-popover>
          <el-button
              slot="reference"
              size="mini"
              @click="handleEdit(scope.$index, scope.row)">编辑
           </el-button>
          <el-button
            size="mini"
            type="danger"
            slot="reference"
            @click="handleDelete(scope.$index, scope.row)">删除</el-button>
             
            <el-button
            size="mini"
            slot="reference"
            @click="handleAccept(scope.$index, scope.row)">同意申请</el-button>
        </template>
      </el-table-column>
    </el-table>
    
    <el-row>
      <el-button type="primary" @click="handleAdd()">申请新门店</el-button>
    </el-row>
    <Pager
      :page="page"
      :limit="limit"
      :total="total"
      :panelNumber="panelNumber"
      @changePage="handleChangePage"
    />
    </div>
    <BreadNav slot="breadNav" />
  </Theme>
</template>


<script>
import * as StoreService from "@/services/StoreService.js";
import * as StaffService from "@/services/StaffService.js";
import Pager from "@/components/Pager.vue";
import Theme from '@/components/Theme.vue';
import BreadNav from '@/components/BreadNav.vue';
export default {
  inject:['reload'],
  components: {
    Pager,Theme,BreadNav
  },
  data() {
    return {
      storeList: [],
      staffList:[],
      limit: 3,
      panelNumber: 10,
      total: 2020,
      channelName: null,
      store: {
        storeName: "",
        storeLicense: "",
        storeAddress: "",
        storeLocation: "",
        storeBoss: "",
        storeTel: "",
        storeFeature: "",
        storeProportion: "",
        storeLevel: "",
        storePic: "",
        storeState: "申请中",
      },
      queryParam:{
        param1:"",
      },
    };
  },
  created() {
    console.log("create方法");
    this.getStoreList();
    // this.storeList = await StoreService.getStoreList();
    // console.log(this.storeList);
  },
  methods: {
    async handleShow(index, row) {
      // console.log(index);
      // var resp= await getStoreById(row.storeId);
      //好像不用写这个根据id查的方法
    },
    handleCheck(index, row) {
      console.log(index, row.storeId);
      this.store = row;
    },
    async handleAccept(index,row){
        row.storeState ="已通过"
       var resp = await StoreService.updateStore(row)
       if(resp==true){
         console.log("修改成功");
         this.reload();
       }else{
         console.log("修改失败");
       }
    },
    async handleEdit(index, row) {
      // console.log(index, row.storeId);
      // this.store = row;
      // var resp = await StaffService.getStaffList(row.storeId);
      // this.staffList =resp;
      this.$router.push({
        name:"UpdateStore",
        params:{
          storeId:row.storeId,
        }
      })
    },
    async handleDelete(index,row){
      console.log("==========删除门店===========");
       var resp = await StoreService.deleteStore(row.storeId);
      //  console.log(resp);
       if(resp==true){
        console.log("删除门店成功");
        this.reload();
      }else{
        console.log("删除失败");
      }
    },
    async queryStore(){
      console.log("==========查询门店=========")
      var resp = await StoreService.findStore(this.queryParam.param1,this.page,this.limit)
      console.log(resp);
      this.storeList = resp.list;
      this.total = resp.total;

    },

   

    // async onSubmit(index, row) {
    //   var resp = await StoreService.updateStore(row);
    //   console.log("修改门店", row.storeId);
    //   console.log(resp);
    //   if (resp.data == true) {
    //     console.log("修改成功.....");
    //   } else {
    //     console.log("修改失败.....");
    //   }
    // },

  


    handleAdd() {
      this.$router.push({ name: "AddStore" });
    },
    handleChangePage(newPage) {
      this.$router.push({
        name: "Store",

        query: {
          page: newPage,
        },
      });
      this.getStoreList();
      // this.getNewsList();
    },
    //  async getNewsList(){
    //     var resp= await NewsService.getNewsList(
    //         this.$route.params.id,
    //         this.page,
    //         this.limit
    //     );
    //     // console.log(resp.data.showapi_res_body.pagebean);
    //     var newsData =resp.data.showapi_res_body.pagebean;
    //     this.total =newsData.allNum;
    //     this.news =newsData.contentlist
    //     // console.log(this.news);
    // }
    async getStoreList() {
      
      var resp = await StoreService.findStore(this.queryParam.param1,this.page, this.limit);
      this.storeList = resp.list;
      this.total = resp.total;
      console.log(resp.list);
      console.log("门店总数", resp.total);
    },
  },
  computed: {
    page() {
      return +this.$route.query.page || 1;
    },
  },
};
</script>

<style>
</style>